Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(vx-marker): add markers #783

Merged
merged 8 commits into from
Aug 19, 2020
Merged

feat(vx-marker): add markers #783

merged 8 commits into from
Aug 19, 2020

Conversation

hshoff
Copy link
Member

@hshoff hshoff commented Aug 19, 2020

Markers are pretty handy. You define them in <defs> and attach them to paths or shapes through marker-start, marker-end and/or marker-mid attributes.

This PR was inspired by Keynote when I was editing a presentation and saw the line endpoints editor:

💥 Breaking Changes

  • [marker] remove old <Marker /> implementation of a Line and some Text

🚀 Enhancements

  • [marker] add new <Marker /> that matches actual SVG <marker>
  • [marker] add <MarkerArrow />, <MarkerCross />, <MarkerX />, <MarkerCircle />, <MarkerLine />

📝 Documentation

  • [demo] updated curves demo to use new <Marker>

🏋️ Tests

  • [marker] added tests

📸 Screenshots

image
image
image

Copy link
Collaborator

@williaster williaster left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice add! I love moving this closer to the native marker element. Had a couple small comments.

Will miss the gradient on this demo ... but we have enough gradients in other demos 😄

packages/vx-marker/Readme.md Outdated Show resolved Hide resolved
packages/vx-marker/src/markers/Circle.tsx Outdated Show resolved Hide resolved
packages/vx-marker/src/markers/Marker.tsx Outdated Show resolved Hide resolved
packages/vx-marker/src/markers/Marker.tsx Show resolved Hide resolved
packages/vx-marker/src/markers/X.tsx Outdated Show resolved Hide resolved
packages/vx-marker/src/markers/Line.tsx Outdated Show resolved Hide resolved
@hshoff hshoff merged commit 1864626 into master Aug 19, 2020
@hshoff hshoff deleted the harry-svg-marker branch August 19, 2020 16:30
@rayshan
Copy link
Contributor

rayshan commented Oct 4, 2020

This is an awesome feature! What's the replacement for the old marker? Make my own line / text?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants